<template>
	<view class="c-pages">
		<block v-if="isload">
			<form @submit="subform">
				<view class="apply_box">
					<view class="apply_item">
						<view><text style="color:red"> *</text>姓名</view>
						<view class="flex-y-center"><input type="text" name="name" :value="info.name"
								placeholder="请填写姓名"></input></view>
					</view>
					<view class="apply_item">
						<view><text style="color:red"> *</text>性别</view>
						<view>
							<picker @change="cateChange" :value="cindex" :range="cateArr">
								<view class="picker">{{ cateArr[cindex] }}</view>
							</picker>
						</view>
					</view>
					<view class="apply_item">
						<view><text style="color:red"> *</text>手机号</view>
						<view class="flex-y-center"><input type="text" name="mobile" :value="info.mobile"
								placeholder="请填写手机号码"></input></view>
					</view>

					<view class="apply_item">
						<text><text style="color:red"> *</text>联系公司</text>
						<view class="flex-y-center"><input type="text" name="company" :value="info.company"
								placeholder="请填写联系公司" autocomplete="off"></input></view>
					</view>
					<view class="apply_item">
						<text><text style="color:red"> *</text>联系人职位</text>
						<view class="flex-y-center"><input type="text" name="position" :value="info.position"
								placeholder="请填写联系人职位" autocomplete="off"></input></view>
					</view>
					<view class="apply_item">
						<text><text style="color:red"> *</text>想要资源</text>
						<view class="flex-y-center"><input type="text" name="want_resources"
								:value="info.want_resources" placeholder="请填想要资源" autocomplete="off"></input></view>
					</view>
					<view class="apply_item">
						<text><text style="color:red"> *</text>自有资源</text>
						<view class="flex-y-center"><input type="text" name="own_resources" :value="info.own_resources"
								placeholder="请填写自有资源" autocomplete="off"></input></view>
					</view>

					<view style="padding:30rpx 0"><button form-type="submit" class="set-btn"
							:style="'background:' + t('color1') + ' '">立即报名</button>
					</view>

				</view>
			</form>

		</block>
		<loading v-if="loading"></loading>
		<dp-tabbar :opt="opt"></dp-tabbar>
		<popmsg ref="popmsg"></popmsg>
	</view>
</template>

<script>
var app = getApp();

export default {
	data() {
		return {
			opt: {},
			loading: false,
			isload: false,
			menuindex: -1,

			pre_url: app.globalData.pre_url, static_url: app.globalData.static_url,
			info: {},
			pid: 0,
			sex: 1,
			cateArr: ['男', '女'],
			cindex: 0,
			clist: [{ id: 1, name: '男' }, { id: 1, name: '女' }]
		};
	},

	onLoad: function (opt) {
		this.opt = app.getopts(opt);
		this.pid = this.opt.pid
		this.getdata();
	},
	onPullDownRefresh: function () {
		this.getdata();
	},
	methods: {
		getdata: function () {
			var that = this;
			that.loading = true;
			app.get('Party/apply', { pid: that.pid }, function (res) {
				that.loading = false;
				if (res.status == 0) {
					that.isload = true
				} else {
					app.error(res.msg); return;
				}
			});
		},
		cateChange: function (e) {
			this.cindex = e.detail.value;
			this.sex = this.clist[that.cindex].id;
		},
		subform: function (e) {
			var that = this;
			var info = e.detail.value;
			if (info.name == '') {
				app.error('请填写报名姓名');
				return false;
			}
			if (info.mobile == '') {
				app.error('请填写手机号');
				return false;
			}
			if (!/(^0?1[3|4|5|6|7|8|9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]$)/.test(info.mobile)) {
				app.error('请填写正确手机号');
				return false;
			}

			if (info.company == '') {
				app.error('请填写联系公司');
				return false;
			}
			if (info.position == '') {
				app.error('请填写职位');
				return false;
			}
			if (info.want_resources == '') {
				app.error('请填写想要资源');
				return false;
			}
			if (info.own_resources == '') {
				app.error('请填写自有资源');
				return false;
			}
			info.sex = that.sex
			info.pid = that.pid
			//console.log(info,9999);return;
			app.showLoading('提交中');
			app.post("Party/apply", {
				info: info
			}, function (res) {
				app.showLoading(false);
				app.error(res.msg);
				if (res.status == 1) {
					setTimeout(function () {
						uni.navigateTo({
							url: "/pagesExt/party/lists"
						})
					}, 1000);
				}
			});
		},

	}
}
</script>
<style>
radio {
	transform: scale(0.6);
}

checkbox {
	transform: scale(0.6);
}

.c-pages {
	/*background: linear-gradient(90deg,#ffa374 0%,#ff688b 100%);*/
}

.apply-top {}

.apply-top image {
	width: 100%;
}

.apply_box {
	padding: 2rpx 24rpx 0 24rpx;
	background: #fff;
	margin: 0rpx 24rpx;
	border-radius: 10rpx;
	height: 100vh;
}

.apply_title {
	background: #fff
}

.apply_title .qr_goback {
	width: 18rpx;
	height: 32rpx;
	margin-left: 24rpx;
	margin-top: 34rpx;
}

.apply_title .qr_title {
	font-size: 36rpx;
	color: #242424;
	font-weight: bold;
	margin: 0 auto;
	line-height: 100rpx;
}

.apply_item {
	line-height: 100rpx;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #eee
}

.apply_box .apply_item:last-child {
	border: none
}

.apply_item input {
	width: 100%;
	border: none;
	color: #111;
	font-size: 28rpx;
	text-align: right
}

.apply_item input::placeholder {
	color: #999999
}

.apply_item textarea {
	width: 100%;
	min-height: 200rpx;
	padding: 20rpx 0;
	border: none;
}

.apply_item .upload_pic {
	margin: 50rpx 0;
	background: #F3F3F3;
	width: 90rpx;
	height: 90rpx;
	text-align: center
}

.apply_item .upload_pic image {
	width: 32rpx;
	height: 32rpx;
}

.set-btn {
	width: 90%;
	margin: 0 5%;
	height: 96rpx;
	line-height: 96rpx;
	border-radius: 48rpx;
	color: #FFFFFF;
	font-weight: bold;
}

.layui-imgbox {
	margin-right: 16rpx;
	margin-bottom: 10rpx;
	font-size: 24rpx;
	position: relative;
}

.layui-imgbox-close {
	position: absolute;
	display: block;
	width: 32rpx;
	height: 32rpx;
	right: -16rpx;
	top: -16rpx;
	z-index: 90;
	color: #999;
	font-size: 32rpx;
	background: #fff
}

.layui-imgbox-close image {
	width: 100%;
	height: 100%
}

.layui-imgbox-img {
	display: block;
	width: 200rpx;
	height: 200rpx;
	padding: 2px;
	border: #d3d3d3 1px solid;
	background-color: #f6f6f6;
	overflow: hidden
}

.layui-imgbox-img>image {
	max-width: 100%;
}

.layui-imgbox-repeat {
	position: absolute;
	display: block;
	width: 32rpx;
	height: 32rpx;
	line-height: 28rpx;
	right: 2px;
	bottom: 2px;
	color: #999;
	font-size: 30rpx;
	background: #fff
}

.uploadbtn {
	position: relative;
	height: 200rpx;
	width: 200rpx
}
</style>